<template>
  <el-container>
    <el-header>居民管理</el-header>
    <el-main>
      <el-form :inline="true" :model="form" class="demo-form-inline">
        <el-form-item label="签约状态">
          <el-select v-model="a"  placeholder="请选择">
            <el-option label="已签约" value="已签约"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="签约机构">
          <el-select v-model="a"  placeholder="请选择">
            <el-option label="机构一" value="机构一"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="医生团队">
          <el-select v-model="a"  placeholder="请选择">
            <el-option label="医生团队一" value="医生团队一"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="服务包">
          <el-select v-model="a"  placeholder="请选择">
            <el-option label="服务包一" value="服务包一"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="居民标签">
          <el-select v-model="tag" multiple placeholder="请选择">
            <el-option label="高血压" value="高血压"></el-option>
            <el-option label="高血糖" value="高血糖"></el-option>
            <el-option label="慢病护理" value="慢病护理"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-input v-model="form.name" placeholder="请输入关键字"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="juminFindAll">查询</el-button>
          <el-button type="primary" @click="toAdd">新增居民档案</el-button>
          <el-button type="primary" @click="toOut" plain>导出</el-button>
        </el-form-item>
      </el-form>
      <el-table
          ref="multipleTable"
          :data="data"
          style="width: 100%"
          @selection-change="handleSelectionChange">
        <el-table-column
            type="selection"
            width="55">
        </el-table-column>
        <el-table-column
            prop="id"
            label="编号">
        </el-table-column>
        <el-table-column
            label="姓名">
          <template slot-scope="scope">
            <el-image v-if="scope.row.photo!=null && scope.row.photo!=''" style="width: 40px; height: 40px" :src="scope.row.photo">
            </el-image>
            {{ scope.row.name }}
          </template>
        </el-table-column>
        <el-table-column
            prop="shenfenId"
            label="身份证">
        </el-table-column>
        <el-table-column
            prop="phone"
            label="手机号">
        </el-table-column>
        <el-table-column
            prop="null"
            label="签约状态">
        </el-table-column>
        <el-table-column
            label="用户标签">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.tag.split(',')[0]" type="danger">{{scope.row.tag.split(',')[0]}}</el-tag>
            <el-tag v-if="scope.row.tag.split(',')[1]">{{scope.row.tag.split(',')[1]}}</el-tag>
            <el-tag v-if="scope.row.tag.split(',')[2]" type="warning">{{scope.row.tag.split(',')[2]}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
            label="居民状态">
          <template slot-scope="scope">
            <el-switch
                v-model="scope.row.status"
                active-color="#13ce66"
                inactive-color="#ff4949"
                @change="upStatus(scope.row)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column
            width="300px"
            fixed="right"
            label="操作">
          <template slot-scope="scope">
            <el-button @click="toXiangxi(scope.row.id)" type="text" size="small">查看详情</el-button>
            <el-button @click="toUpdate(scope.row)" type="text" size="small">编辑</el-button>
            <el-button @click="" type="text" size="small">发消息</el-button>
            <el-button @click="toManAdd(scope.row)" type="text" size="small">添加服务</el-button>
            <el-button @click="deJumin(scope.row.id)" type="text" size="small" style="color: red">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-dialog title="居民信息" :visible.sync="dia1" width="85%">
        <el-form :inline="true" :rules="rules" :model="pojo" class="demo-form-inline">
          <el-form-item label="姓名" prop="name" label-width="150px">
            <el-input v-model="pojo.name" placeholder="姓名"></el-input>
          </el-form-item>
          <el-form-item label="身份证号" prop="shenfenId" label-width="150px">
            <el-input v-model="pojo.shenfenId" placeholder="身份证号"></el-input>
          </el-form-item>
          <el-form-item label="性别" prop="sex" label-width="150px">
            <el-select v-model="pojo.sex" clearable placeholder="请选择">
              <el-option label="男" value="男"></el-option>
              <el-option label="女" value="女"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="出生年月" prop="birthday" label-width="150px">
            <el-date-picker
                v-model="pojo.birthday"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="手机号码" prop="phone" label-width="150px">
            <el-input v-model="pojo.phone" placeholder="手机号码"></el-input>
          </el-form-item>
          <el-form-item label="现居地" label-width="150px">
            <el-input v-model="pojo.address" placeholder="现居地"></el-input>
          </el-form-item>
          <el-form-item label="居民标签" label-width="150px">
            <el-select v-model="tag" multiple placeholder="请选择">
              <el-option label="高血压" value="高血压"></el-option>
              <el-option label="高血糖" value="高血糖"></el-option>
              <el-option label="慢病护理" value="慢病护理"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="家庭成员" label-width="150px">
            <el-link @click="guanlian" style="color: dodgerblue;font-size: 14px;width: 200px">+关联家庭成员</el-link>
          </el-form-item>
          <el-dialog
              width="30%"
              title="家庭成员"
              :visible.sync="dia2"
              append-to-body>
        选择成员:<el-select v-model="twoid" placeholder="请选择">
                 <el-option
                   v-for="item in data"
                   :key="item.id"
                   :label="item.name"
                   :value="item.id">
                 </el-option>
               </el-select>
            <br>
            选择关系:<el-select v-model="guanxi" placeholder="请选择" style="margin-top: 10px">
            <el-option label="父母" value="父母"></el-option>
            <el-option label="配偶" value="配偶"></el-option>
            <el-option label="兄弟" value="兄弟"></el-option>
            <el-option label="姐妹" value="姐妹"></el-option>
          </el-select>
            <br>
            <el-button style="margin-top: 100px" type="primary" @click="dia2=false">返回</el-button>
            <el-button type="primary" @click="toGuanxi">添加成员</el-button>
          </el-dialog>
          <el-form-item label="登陆密码" prop="password" label-width="150px">
            <el-input v-model="pojo.password" placeholder="登陆密码"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="add">保存</el-button>
          <el-button type="primary" @click="toAllAdd">完善居民档案</el-button>
          <el-button type="success" @click="">立即签约</el-button>
          <el-button @click="dia1 = false">返回</el-button>
        </div>
      </el-dialog>
      <el-dialog title="完善档案信息" :visible.sync="dia3" width="85%">
        居民信息<br>
        <el-form :inline="true" :rules="rules" :model="pojo" class="demo-form-inline">
          <el-form-item label="姓名" prop="name" label-width="150px">
            <el-input v-model="pojo.name" placeholder="姓名"></el-input>
          </el-form-item>
          <el-form-item label="头像" label-width="150px">
            <el-upload
                class="avatar-uploader"
                action="http://localhost:8801/jumin/uploadLocal"
                :show-file-list="false"
                :on-success="handleAvatarSuccess">
              <img v-if="imageUrl" :src="imageUrl" class="avatar">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </el-form-item>
          <br>
          <el-form-item label="身份证号" prop="shenfenId" label-width="150px">
            <el-input v-model="pojo.shenfenId" placeholder="身份证号"></el-input>
          </el-form-item>
          <el-form-item label="手机号码" prop="phone" label-width="150px">
            <el-input v-model="pojo.phone" placeholder="手机号码"></el-input>
          </el-form-item>
          <el-form-item label="居民标签" label-width="150px">
            <el-select v-model="tag" multiple placeholder="请选择">
              <el-option label="高血压" value="高血压"></el-option>
              <el-option label="高血糖" value="高血糖"></el-option>
              <el-option label="慢病护理" value="慢病护理"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="现居地" label-width="150px">
            <el-input v-model="pojo.address" placeholder="现居地" style="width: 800px"></el-input>
          </el-form-item>
          <el-form-item label="行政划区" label-width="150px">
            <el-input v-model="pojo.xingzhengqu" placeholder="行政划区"></el-input>
          </el-form-item>
          <el-form-item label="户籍地址" label-width="150px">
            <el-input v-model="pojo.jiguan" placeholder="户籍地址" style="width: 800px"></el-input>
          </el-form-item>
          <el-form-item label="家庭成员" label-width="150px">
            <el-link @click="guanlian" style="color: dodgerblue;font-size: 14px;width: 200px">+关联家庭成员</el-link>
          </el-form-item>
          <el-form-item label="性别" prop="sex" label-width="150px">
            <el-select v-model="pojo.sex" clearable placeholder="请选择">
              <el-option label="男" value="男"></el-option>
              <el-option label="女" value="女"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="出生年月" prop="birthday" label-width="150px">
            <el-date-picker
                v-model="pojo.birthday"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="籍贯" label-width="150px">
            <el-input v-model="pojo.jiguan" placeholder="籍贯"></el-input>
          </el-form-item>
          <el-form-item label="民族" label-width="150px">
            <el-select v-model="pojo.minzu" clearable placeholder="请选择">
              <el-option label="汉族" value="汉族"></el-option>
              <el-option label="回族" value="回族"></el-option>
              <el-option label="维吾尔族" value="维吾尔族"></el-option>
              <el-option label="壮族" value="壮族"></el-option>
              <el-option label="其他少数民族" value="其他少数民族"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="文化程度" label-width="150px">
            <el-select v-model="pojo.wenhua" clearable placeholder="请选择">
              <el-option label="小学" value="小学"></el-option>
              <el-option label="初中" value="初中"></el-option>
              <el-option label="高中" value="高中/中专"></el-option>
              <el-option label="大学" value="大专及以上"></el-option>
              <el-option label="其他" value="不详"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="婚姻状况" label-width="150px">
            <el-select v-model="pojo.hunyin" clearable placeholder="请选择">
              <el-option label="已婚" value="已婚"></el-option>
              <el-option label="未婚" value="未婚"></el-option>
              <el-option label="离异" value="离异"></el-option>
              <el-option label="丧偶" value="丧偶"></el-option>
              <el-option label="不详" value="不详"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="职业" label-width="150px">
            <el-input v-model="pojo.zhiye" placeholder="职业"></el-input>
          </el-form-item>
          <el-form-item label="工作单位" label-width="150px">
            <el-input v-model="pojo.danwei" placeholder="工作单位" style="width: 800px"></el-input>
          </el-form-item>
          <el-form-item label="紧急联系人" label-width="150px">
            <el-input v-model="pojo.sos" placeholder="紧急联系人"></el-input>
          </el-form-item>
          <el-form-item label="联系电话" label-width="150px">
            <el-input v-model="pojo.lianxiren" placeholder="联系电话"></el-input>
          </el-form-item>
          <el-form-item label="登录密码" label-width="150px">
            <el-input v-model="pojo.password" placeholder="登录密码"></el-input>
          </el-form-item>
          <el-form-item label="户籍类型" label-width="150px">
            <el-select v-model="pojo.huji" clearable placeholder="请选择">
              <el-option label="城镇" value="城镇"></el-option>
              <el-option label="农村" value="农村"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="定点医疗单位" label-width="150px">
            <el-input v-model="pojo.yiyuan" placeholder="定点医疗单位" style="width: 800px"></el-input>
          </el-form-item>
          <el-form-item label="费用类型" label-width="150px">
            <el-checkbox-group v-model="feiyong">
              <el-checkbox label="自费"></el-checkbox>
              <el-checkbox label="社会医疗保险"></el-checkbox>
              <el-checkbox label="商业保险"></el-checkbox>
              <el-checkbox label="新农合"></el-checkbox>
              <el-checkbox label="其他"></el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <br>
          健康信息<br>
          <el-form-item label="身高" label-width="150px">
            <el-input v-model="pojo.shengao" placeholder="身高"></el-input>
          </el-form-item>
          <el-form-item label="体重" label-width="150px">
            <el-input v-model="pojo.tizhong" placeholder="体重"></el-input>
          </el-form-item>
          <el-form-item label="血型" label-width="150px">
            <el-select v-model="pojo.xuexing" clearable placeholder="请选择">
              <el-option label="A型" value="A型"></el-option>
              <el-option label="B型" value="B型"></el-option>
              <el-option label="O型" value="O型"></el-option>
              <el-option label="AB型" value="AB型"></el-option>
              <el-option label="不详" value="不详"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="RH阴性" label-width="150px">
            <el-select v-model="pojo.rh" clearable placeholder="请选择">
              <el-option label="是" value="是"></el-option>
              <el-option label="否" value="否"></el-option>
              <el-option label="不详" value="不详"></el-option>
            </el-select>
          </el-form-item>
          <br>
          <el-form-item label="过敏史" label-width="150px">
            <el-radio v-model="pojo.guomin" label="无">无</el-radio>
            <el-radio v-model="pojo.guomin" label="有">有</el-radio>
          </el-form-item>
          <el-form-item label="既往史" label-width="150px">
            <el-radio v-model="pojo.jiwang" label="无">无</el-radio>
            <el-radio v-model="pojo.jiwang" label="有">有</el-radio>
          </el-form-item>
          <el-form-item label="就诊史" label-width="150px">
            <el-radio v-model="pojo.jiuzhen" label="无">无</el-radio>
            <el-radio v-model="pojo.jiuzhen" label="有">有</el-radio>
          </el-form-item>
          <el-form-item label="家族病史" label-width="150px">
            <el-radio v-model="pojo.jiazu" label="无">无</el-radio>
            <el-radio v-model="pojo.jiazu" label="有">有</el-radio>
          </el-form-item>
          <el-button @click="quxiao">取消</el-button>
          <el-button type="primary" @click="add">保存</el-button>
        </el-form>
      </el-dialog>
      <el-dialog title="居民管理" :visible.sync="dia4" width="85%">
        <el-button-group>
          <el-button type="primary" @click="dia4=true">健康档案</el-button>
          <el-button type="primary" plain @click="">健康记录</el-button>
          <el-button type="primary" plain @click="findSign(xiangxi.id)">签约记录</el-button>
          <el-button type="primary" plain @click="findMan(xiangxi.id)">服务记录</el-button>
        </el-button-group>
        <el-descriptions title="居民信息">
          <el-descriptions-item label="居民编号">{{xiangxi.id}}</el-descriptions-item>
          <el-descriptions-item label="姓名">{{xiangxi.name}}</el-descriptions-item>
          <el-descriptions-item label="头像">
            <el-image v-if="xiangxi.photo!=null && xiangxi.photo!=''" style="width: 60px; height: 60px" :src="xiangxi.photo">
            </el-image>
          </el-descriptions-item>
          <el-descriptions-item label="身份证号">{{xiangxi.shenfenId}}</el-descriptions-item>
          <el-descriptions-item label="手机号">{{xiangxi.phone}}</el-descriptions-item>
          <el-descriptions-item label="现居地">{{xiangxi.address}}</el-descriptions-item>
          <el-descriptions-item label="登陆密码">{{xiangxi.password}}</el-descriptions-item>
          <el-descriptions-item label="行政划区">{{xiangxi.xingzhengqu}}</el-descriptions-item>
          <el-descriptions-item label="居民标签">
            <el-tag v-for="item in tags" :key="item">{{item}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="性别">{{xiangxi.sex}}</el-descriptions-item>
          <el-descriptions-item label="出生日期">{{xiangxi.birthday}}</el-descriptions-item>
          <el-descriptions-item label="籍贯">{{xiangxi.jiguan}}</el-descriptions-item>
          <el-descriptions-item label="民族">{{xiangxi.minzu}}</el-descriptions-item>
          <el-descriptions-item label="文化程度">{{xiangxi.wenhua}}</el-descriptions-item>
          <el-descriptions-item label="婚姻程度">{{xiangxi.hunyin}}</el-descriptions-item>
          <el-descriptions-item label="职业">{{xiangxi.zhiye}}</el-descriptions-item>
          <el-descriptions-item label="工作单位">{{xiangxi.danwei}}</el-descriptions-item>
          <el-descriptions-item label="紧急联系人">{{xiangxi.sos}}</el-descriptions-item>
          <el-descriptions-item label="联系人电话">{{xiangxi.lianxiren}}</el-descriptions-item>
          <el-descriptions-item label="户籍类型">{{xiangxi.huji}}</el-descriptions-item>
          <el-descriptions-item label="费用类型">{{xiangxi.feiyong}}</el-descriptions-item>
          <el-descriptions-item label="定点医疗单位">{{xiangxi.yiyuan}}</el-descriptions-item>
          <el-descriptions-item label="来源">用户注册</el-descriptions-item>
        </el-descriptions>
        <el-descriptions title="健康信息">
          <el-descriptions-item label="身高">{{xiangxi.shengao}}</el-descriptions-item>
          <el-descriptions-item label="体重">{{xiangxi.tizhong}}</el-descriptions-item>
          <el-descriptions-item label="血型">{{xiangxi.xuexing}}</el-descriptions-item>
          <el-descriptions-item label="RH阴性">{{xiangxi.rh}}</el-descriptions-item>
          <el-descriptions-item label="过敏史">{{xiangxi.guomin}}</el-descriptions-item>
          <el-descriptions-item label="既往史">{{xiangxi.jiwang}}</el-descriptions-item>
          <el-descriptions-item label="就诊史">{{xiangxi.jiuzhen}}</el-descriptions-item>
          <el-descriptions-item label="家族病史">{{xiangxi.jiazu}}</el-descriptions-item>
        </el-descriptions>
        <el-descriptions title="家庭成员" v-show="da.length>0">
          <el-descriptions-item v-for="item in da" :key="item.id" label="">
            <el-image v-if="item.photo!=null && item.photo!=''" style="width: 40px; height: 40px" :src="item.photo">w
            </el-image>
            <span style="font-size: 18px">{{item.name}}</span>
            <span style="font-size: 14px">{{item.sex}}</span>
            <span style="font-size: 14px">关系：{{item.guanxi}}</span>
          </el-descriptions-item>
        </el-descriptions>
        <el-button type="primary" @click="">编辑档案信息</el-button>
        <el-button @click="dia4=false">返回</el-button>
      </el-dialog>
      <el-dialog title="服务记录" :visible.sync="dia5" width="85%">
        <el-button-group>
          <el-button type="primary" plain @click="dia4=true">健康档案</el-button>
          <el-button type="primary" plain @click="">健康记录</el-button>
          <el-button type="primary" plain @click="findSign(xiangxi.id)">签约记录</el-button>
          <el-button type="primary" @click="findMan(xiangxi.id)">服务记录</el-button>
          <el-table
              :data="manAll"
              style="width: 100%">
            <el-table-column
                prop="sid"
                label="服务编号">
            </el-table-column>
            <el-table-column
                prop="sstatus"
                label="服务状态">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.sstatus==1" type="warning">待审核</el-tag>
                <el-tag v-else-if="scope.row.sstatus==2" type="primary">待服务</el-tag>
                <el-tag v-else-if="scope.row.sstatus==3" type="danger">已驳回</el-tag>
                <el-tag v-else-if="scope.row.sstatus==4" type="success">已服务</el-tag>
                <el-tag v-else-if="scope.row.sstatus==5" type="info">已取消</el-tag>
              </template>
            </el-table-column>
            <el-table-column
                prop="institutionName"
                label="服务机构">
            </el-table-column>
            <el-table-column
                prop="teamName"
                label="团队名称">
            </el-table-column>
            <el-table-column
                prop="doctorName"
                label="医生名称">
            </el-table-column>
            <el-table-column
                prop="serviceName"
                label="服务包">
            </el-table-column>
            <el-table-column
                prop="itempmName"
                label="服务项目">
            </el-table-column>
            <el-table-column
                prop="sbeizhu"
                label="服务备注">
            </el-table-column>
          </el-table>
          <el-button type="primary" @click="">新增服务</el-button>
          <el-button type="primary" plain @click="dia5=false">返回</el-button>
        </el-button-group>
      </el-dialog>
      <el-dialog title="服务记录" :visible.sync="dia6" width="85%">
        <el-button-group>
          <el-button type="primary" plain @click="dia4=true">健康档案</el-button>
          <el-button type="primary" plain @click="">健康记录</el-button>
          <el-button type="primary" @click="findSign(xiangxi.id)">签约记录</el-button>
          <el-button type="primary" plain @click="findMan(xiangxi.id)">服务记录</el-button>
          <el-table
              :data="SignAll"
              style="width: 100%">
            <el-table-column
                prop="id"
                label="签约编号">
            </el-table-column>
            <el-table-column
                label="签约状态">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.status==0" type="warning">待审核</el-tag>
                <el-tag v-else-if="scope.row.status==1" type="primary">待支付</el-tag>
                <el-tag v-else-if="scope.row.status==2" type="danger">已驳回</el-tag>
                <el-tag v-else-if="scope.row.status==3" type="success">生效中</el-tag>
                <el-tag v-else-if="scope.row.status==4" type="success">已过期</el-tag>
              </template>
            </el-table-column>
            <el-table-column
                prop="institutionName"
                label="机构名称">
            </el-table-column>
            <el-table-column
                prop="teamName"
                label="团队名称">
            </el-table-column>
            <el-table-column
                prop="serviceName"
                label="服务包">
            </el-table-column>
            <el-table-column
                prop="doctorName"
                label="医生名称">
            </el-table-column>
            <el-table-column
                prop="expirationDate"
                label="到期时间">
            </el-table-column>
          </el-table>
          <el-button type="primary" plain @click="dia6=false">返回</el-button>
        </el-button-group>
      </el-dialog>

      <el-dialog title="服务添加" :visible.sync="dia7">
        <el-form :model="fuwu">
          <el-form-item label="输入居民">
            <el-select v-model="fuwu.juminid" placeholder="请选择" disabled>
              <el-option
                  v-for="item in JuminList"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="身份证号">
            <el-input v-model="fuwu.sidnumber" autocomplete="off" placeholder="请选择" disabled></el-input>
          </el-form-item>  <el-form-item label="手机号码">
          <el-input v-model="fuwu.sphone" autocomplete="off" placeholder="请选择" disabled></el-input>
        </el-form-item>
          <el-form-item label="性别">
            <el-radio-group v-model="fuwu.ssex" disabled>
              <el-radio :label="1" :value="1">男</el-radio>
              <el-radio :label="2" :value="2">女</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item label="出生年月">
            <!--          <el-date-picker v-model="form.startime" type="date" placeholder="选择日期" style="width: 200px"></el-date-picker> 至-->
            <el-date-picker v-model="fuwu.sentdate" type="date" placeholder="选择日期" style="width: 200px" disabled></el-date-picker>
          </el-form-item>

          <el-form-item label="现居地">
            <el-input v-model="fuwu.sxian" autocomplete="off" placeholder="请选择" disabled></el-input>
          </el-form-item>

          服务信息

          <el-form-item label="服务机构">
            <el-select v-model="fuwu.instid" placeholder="请选择">
              <el-option
                  v-for="item in InstitutionList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="团队服务">
            <el-select v-model="fuwu.teamid" placeholder="请选择">
              <el-option
                  v-for="item in teamList"

                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="服务医生">
            <el-select v-model="fuwu.doctorid" placeholder="请选择">
              <el-option
                  v-for="item in DoctorList"
                  :label="item.doctorName"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>



          <el-form-item label="服务包">
            <el-select v-model="fuwu.serviceid" placeholder="请选择">
              <el-option
                  v-for="item in serviceList"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="服务项目">
            <el-select v-model="fuwu.itempmid" placeholder="请选择">
              <el-option
                  v-for="item in ItempmList"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="服务地点">
            <el-select v-model="fuwu.locaid" placeholder="请选择">
              <el-option
                  v-for="item in LocaList"
                  :label="item.locaname"
                  :value="item.locaid">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="服务备注">
            <el-input v-model="fuwu.sbeizhu" autocomplete="off" placeholder="请选择" ></el-input>
          </el-form-item>
        </el-form>
        <div class="dialog-footer">
          <el-button @click="dia7 = false">取 消</el-button>
          <el-button type="primary" @click="saveOrUpdate">确 定</el-button>
        </div>
      </el-dialog>
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageNum"
          :page-sizes="[20, 40, 60, 80]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
    </el-main>
  </el-container>
</template>
<script>
import axios from "axios";
export default {
  data(){
    return{
      man:{},
      dia4:false,
      da:[],
      xiangxi:{},
      feiyong:[],
      arr:[],
      dia2:false,
      twoid:'',
      guanxi:'',
      dia1:false,
      a:'',
      data:[],
      total:0,
      pageNum:1,
      pageSize:20,
      tag:[],
      form:{},
      multipleSelection:[],
      pojo:{},
      chengyuan:'',
      rules:{
        name:[
          {required:true,message:'姓名不能为空',trigger:'blur'},
        ],
        shenfenId:[
          {required:true,message:'身份证号不能为空',trigger:'blur'},
        ],
        phone:[
          {required:true,message:'手机号码不能为空',trigger:'blur'},
        ],
        password:[
          {required:true,message:'登陆密码不能为空',trigger:'blur'},
        ],
        sex:[
          {required:true,message:'性别不能为空',trigger:'change'},
        ],
        birthday:[
          {required:true,message:'出生年月不能为空',trigger:'change'},
        ],
      },
      str:'',
      dia3:false,
      tags:[],
      imageUrl:'',
      ids:[],
      manAll:[],
      dia5:false,
      dia6:false,
      SignAll:[],
      Sign:{},
      fuwu:{},
      dia7:false,
      deptList:[],
      InstitutionList:[],
      teamList:[],
      DoctorList:[],
      serviceList:[],
      BqList:[],
      ItempmList:[],
      JuminList:[],
      LocaList:[],
    }
  },
  methods:{
    toManAdd(row){
      this.fuwu.juminid=row.id;
      this.fuwu.sidnumber=row.shenfenId;
      this.fuwu.sphone=row.phone;
      this.fuwu.ssex=row.sex=='男'?1:2;
      this.fuwu.sentdate=row.birthday;
      this.fuwu.sxian=row.address;
      this.dia7=true;
      this.dialogFormTeam();
    },
    saveOrUpdate() {
      axios.post('http://localhost:9002/Management/add', this.fuwu).then(res => {
        if (res.data == false) {
          this.$message.error("操作失败");
        } else {
          this.$message.success("操作成功");
          //2.关闭弹窗
          this.dia7 = false;

          //3.刷新页面
          this.juminFindAll();
        }
      })
    },
    dialogFormTeam(){
      axios.get(`http://localhost:9002/zong/findAll`).then(res=>{
        this.teamList=res.data.TeamList;
        this.serviceList=res.data.ServiceList
        this.BqList=res.data.BqList
        this.InstitutionList=res.data.InstitutionList;
        this.ItempmList=res.data.ItempmList;
        this.DoctorList=res.data.DoctorList;
        this.JuminList=res.data.JuminList;
        this.LocaList=res.data.LocaList;
      })
    },
    findSign(id){
      this.Sign.statusList=[3,4];
      this.Sign.juminId=id;
      this.Sign.pageNum=1;
      this.Sign.pageSize=100;
      axios.post("http://localhost:8201/pendingSigning/findAllPendingSigning/1",this.Sign).then(res=>{
        this.SignAll=res.data.data.list;
        this.dia6=true;
        this.dia5=false;
        this.dia4=false;
      })
    },
    upStatus(row){
      axios.get(`http://localhost:8801/jumin/upStatus?id=${row.id}`).then(res=>{
        this.$message.success("修改成功");
        this.juminFindAll();
      })
    },
    deJumin(id){
      axios.get(`http://localhost:8801/jumin/deJumin?id=${id}`).then(res=>{
        this.$message.success("删除成功");
        this.juminFindAll();
      })
    },
    toOut(){
      for (let i=0;i<this.multipleSelection.length;i++){
        this.ids.push(this.multipleSelection[i].id);
      }
      axios.get(`http://localhost:8801/jumin/exportExcel?ids=${this.ids}`).then(res=>{
        this.$message.success("导出成功");
        this.ids=[];
      })
    },
    handleAvatarSuccess(res, file) {
      this.pojo.photo=res;//给图片地址赋值
      //展示预览图
      this.imageUrl = URL.createObjectURL(file.raw);
    },
    toUpdate(row){
      this.pojo=row;
      this.imageUrl=row.photo;
      if (row.tag!=null){
        this.tag=row.tag.split(",");
      }
      if (row.feiyong!=null){
        this.feiyong=row.feiyong.split(",");
      }
      this.dia3=true;
      this.arr=[];
      this.chengyuan='';
      this.twoid='';
      this.guanxi='';
    },
    toXiangxi(id){
      axios.get(`http://localhost:8801/jumin/findByid?id=${id}`).then(res=>{
        this.xiangxi=res.data.data;
        this.tags=res.data.data.tag.split(",");
        this.imageUrl=res.data.data.photo;
        this.dia4=true;
      });
      axios.get(`http://localhost:8801/chengyuan/findGuanxi?id=${id}`).then(res=>{
        this.da=res.data;
      })
    },
    quxiao(){
      this.dia3=false;
      this.pojo={};
      this.tag=[];
      this.feiyong=[];
      this.arr=[];
      this.chengyuan='';
    },
    toAllAdd(){
      this.imageUrl='';
      this.dia1=false;
      this.dia3=true;
    },
    guanlian(){
      this.dia2=true;
      this.twoid='';
      this.guanxi='';
    },
    toGuanxi(){
      this.chengyuan=this.twoid+','+this.guanxi;
      this.arr.push(this.chengyuan);
      this.dia2=false;
      this.$message.success('添加成功');
    },
    add(){
      this.pojo.tag=this.tag.join(",");
      this.str=this.arr.join(";");
      this.pojo.feiyong=this.feiyong.join(",");
      axios.post(`http://localhost:8801/jumin/juminAdd?chengyuans=${this.str}`,this.pojo).then(res=>{
        this.tag=[];
        this.dia1=false;
        this.dia3=false;
        this.juminFindAll();
        this.$message.success('添加成功');
      })
    },
    toAdd(){
      this.dia1=true;
      this.pojo={};
      this.tag=[];
      this.feiyong=[];
      this.arr=[];
      this.chengyuan='';
      this.twoid='';
      this.guanxi='';
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    juminFindAll(){
      this.form.tag=this.tag.join(",");
      axios.post(`http://localhost:8801/jumin/juminFindAll?pn=${this.pageNum}&ps=${this.pageSize}`,this.form).then(res=>{
        this.data=res.data.data.records;
        this.total=res.data.data.total;
      })
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.juminFindAll();
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.juminFindAll();
    },
    findMan(id){
      this.man.juminid=id;
      axios.post(`http://localhost:9002/Management/findAll?current=1&size=100`,this.man).then(res=>{
        this.dia5=true;
        this.dia4 = false;
        this.dia6 = false;
        this.manAll=res.data.records;
      })
    },
  },
  mounted() {
    this.juminFindAll();
  }
}
</script>

<style scoped>
    .avatar-uploader .el-upload {
      border: 1px dashed #d9d9d9;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
      border-color: #409EFF;
    }
    .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      line-height: 178px;
      text-align: center;
    }
    .avatar {
      width: 178px;
      height: 178px;
      display: block;
    }
</style>